<!doctype html>
<link rel="match" href="../expected/clip-border-radius-with-css-transform-ref.html" />
<style>
  * {
    margin: 0;
  }
  .outer {
    position: absolute;
    overflow: hidden;
    border-radius: 9999px;
    width: 300px;
    height: 300px;
    transform: translateX(-100px);
    left: 100px;
  }
  .middle {
    overflow: hidden;
    top: 0px;
    bottom: 0px;
    position: absolute;
    width: 300px;
    height: 300px;
    background-color: transparent;
  }
  .inner {
    position: absolute;
    top: 0px;
    bottom: 0px;
    width: 300px;
    height: 300px;
    background: mediumspringgreen;
  }
</style><body><div class="outer"><div class="middle"><div class="inner"></div>
